<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">

  <title>text</title>

  <meta name="viewport" content="width=device-width; initial-scale=1.0">
  <style>
  	#head {
  		width: 350px;
  		//padding:0px 10px 0px 10px;
  		border: 3px dotted pink;
  		border-radius: 10px;
  		//font-family: 나눔고딕;
  		text-align: center;
  		color: orange;
  		text-shadow: 3px 3px 4px #B2CCFF; 
  		position: absolute;
  	}
  	#head2 {
  		width: 350px;
  		//padding:0px 10px 0px 10px;
  		border: 3px dotted #6799FF;
  		border-radius: 10px;
  		//font-family: 나눔고딕;
  		text-align: center;
  		color: orange;
  		text-shadow: 3px 3px 4px #B2CCFF;
  		position: relative; 
  	}
  </style>
  <script>
  	 
  	 // 윈도우(창) 영역이 다 읽혀지면...
  	 window.onload = function(){
  	 	var btn = document.getElemetById("btnCopy");
  	 	btn.onclick = function(){
  	 		var o = frm.ori;
  	 		var t = frm.target;
  	 		t.value = o.value;
  	 	}
  	 }
  </script>
</head>

<body style="font-family: 나눔고딕; background-color: black; color:white;">
  <div id="head">
  	<h1>Text 입력상자의 값 제어  </h1>
  </div>
  <div id="head2">
  	<h1>Text 입력상자의 값 제어  </h1>
  </div>
  <p/>
  <form name="frm" action="" method="post"> </form>
  Origin : <input type="search" name="ori" value="park"/> <br/>
  Copy &nbsp;&nbsp;: <input type="search" name="target"/> <br/>
  <p/>
  <input type="button" id="btnCopy" value="Copy" style="width:50px; height:30px; border-radius: 5px; background-color: #E5D85C"/>
</body>
</html>
